<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>场景原型</title>
    <link rel="stylesheet" href="../css/common.css" />
    <link rel="stylesheet" href="../css/prototype.css" />
  </head>
  <body>
    <!-- 轮播图 -->
    <div class="banner">
      <ul class="item">
        <li style="opacity: 1"><img src="../img/banner1.jpg" alt="" /></li>
        <li><img src="../img/banner2.jpg" alt="" /></li>
        <li><img src="../img/banner3.jpg" alt="" /></li>
      </ul>
      <span class="lef"><</span>
      <span class="rig">></span>
      <ul class="page">
        <li style="background: white"></li>
        <li></li>
        <li></li>
      </ul>
    </div>
    <!-- 导航栏 -->
    <div class="nav">
      <img src="../img/logo.png" alt="" class="logo" />
      <ul>
        <li><a href="/">首页</a></li>
        <li><a href="/role">角色设定</a></li>
        <li><a href="/map">场景地图</a></li>
        <li class="now"><a href="/prototype">场景原型</a></li>
        <li><a href="/evaluation">作品评价</a></li>
        <li><a href="/research">问卷调查</a></li>
      </ul>
    </div>
    <!-- 主要内容 -->
    <div class="main">
      <!-- 场景原型 -->
      <div class="proto">
        <h2>场景原型</h2>
        <div class="wrap">
          <div class="box">
            <img src="../img/proto1-1.webp" alt="" />
            <p>山西隰县小西天大雄宝殿内景</p>
          </div>
          <div class="box">
            <img src="../img/proto1-2.webp" alt="" />

            <p>游戏中的小雷音寺过场</p>
          </div>
        </div>
        <div class="wrap">
          <div class="box">
            <img src="../img/proto2-1.webp" alt="" />
            <p>大足石刻千手观音像</p>
          </div>
          <div class="box">
            <img src="../img/proto2-2.webp" alt="" />

            <p>游戏中的千手观音像</p>
          </div>
        </div>
        <div class="wrap">
          <div class="box">
            <img src="../img/proto3-1.webp" alt="" />
            <p>延庆寺实景</p>
          </div>
          <div class="box">
            <img src="../img/proto3-2.webp" alt="" />

            <p>游戏中的仿延庆寺的寺庙场景</p>
          </div>
        </div>
        <div class="wrap">
          <div class="box">
            <img src="../img/proto4-2.jpg" alt="" />
            <p>泉州开元寺</p>
          </div>
          <div class="box">
            <img src="../img/proto4-1.png" alt="" />
            <p>游戏中的开元寺场景</p>
          </div>
        </div>
      </div>
    </div>

    <!-- 底部 -->
    <footer>
      <p>直面天命 为战而生</p>
    </footer>
    <!-- 引入轮播图js -->
    <script src="../js/banner.js"></script>
  </body>
</html>
